(function (window) {
	'use strict';
	// Your starting point. Enjoy the ride!
	let fillters = {
		all(todos){
			return todos;
		},
		active(todos){
			return todos.filter(todo=>!todo.completed);
		},
		completed(todos){
			return todos.filter(todo=>todo.completed);
		}
	};
	const TODOS_KEY = 'todus-vuev';
    let todoStorage = {
        get () {
            return JSON.parse(localStorage.getItem(TODOS_KEY)) || [];
        },
		set(todos) {
			localStorage.setItem(TODOS_KEY,JSON.stringify(todos));
		}
    };
	const app = new Vue({
		el: ".todoapp",
		data: {
			// 所有事项信息
			// todos: [
			// 	{
			// 		id: 1,title: "示例内容1",completed: true,todo_editing: false,editingContent:""
			// 	},
			// 	{
			// 		id: 2,title: "示例内容2",completed: false,todo_editing: false,editingContent:""
			// 	},
			// 	{
			// 		id: 3,title: "示例内容3",completed: false,todo_editing: false,editingContent:""
			// 	}
			// ],
			todos: todoStorage.get(),
			newToDo: "雪花",
			// 筛选按钮的类名切换与显示状态
			classTdo: 'all'
		},
		methods: {
			// 事项单位复数化处理函数
			pluralize(word){
				return this.noCompleted===1?word:`${word}s`;
			},
			// 回车输入框添加新的事项函数
			addNewToDo(){
				console.log(123);
				let value =  this.newToDo.trim();
				if(value!=""){
					this.todos.push({
						id: this.todos.length+1,
						title: value,
						completed: false,
						todo_editing: false,
						editingContent:""
					});
					this.newToDo='';
				}
			},
			// 每个事项的叉按钮,删除事项自己的实现按钮
			removeTodo(toDo) {
				let index = this.todos.indexOf(toDo);
				this.todos.splice(index,1);
			},
			// 清除所有已经完成事项的按钮事件
			removeCompleted(){
				this.todos = this.todos.filter(todo=>!todo.completed);
			},
			// 双击待办事项,进入输入状态的事件
			editingTdo(toDo){
				let index = this.todos.indexOf(toDo);
				this.todos[index].todo_editing=true;
			},
			// 退出输入状态的事件,.esc
			removeEditingTdo(toDo){
				let index = this.todos.indexOf(toDo);
				this.todos[index].todo_editing=false;
			},
			// 确认输入结果为正确。更新到事项名称
			sendEditingTdo(toDo){
				let index = this.todos.indexOf(toDo);
				if(this.todos[index].editingContent.trim()!==""){
					this.todos[index].todo_editing=false;
					this.todos[index].title = this.todos[index].editingContent;
					this.todos[index].editingContent = "";
				}else{
					alert("字符串不能为空");
				}
			}
		},
		computed: {
			// 计算代办事项还有多少
			noCompleted() {
				// let sum = 0;
				// for(let items of this.todos) {
				// 	if(items.completed!==true){
				// 		sum++;
				// 	}
				// }
				// return sum;
				return this.todos.filter(todo=>!todo.completed).length;
			},
			// 全选按钮的状态值的计算属性
			allDone: {
				get:function(){
					return this.noCompleted === 0;
				},
				set:function(value){
					for(let todo of this.todos){
						todo.completed = value;
					}
				}
			},
			Clear_completed(){
				return this.noCompleted !== this.todos.length;
			},
			// 根据显示按钮状态,来使用筛选器,获取筛选显示后的
			filltersTodo(){
				return fillters[this.classTdo](this.todos);
			}
		},
		watch: {
			todos: {
				deep: true,
				handler: todoStorage.set
			}
		}
	});
})(window);
